/**
 *
 * PocketMine Server Manager design - Plugins providers design.
 * 
 * @author Ad5001
 * @version 1.0.0
 * @license NTOSL (Custom) - View LICENSE.md in the root of the project
 * @copyright (C) Ad5001 2017
 * @package PocketMine Server Manager
 *
 */


/**
  * Poggit tags related
  */

.poggitPluginTag {
    border-radius: 2.5px;
    padding: 4px;
    margin-left: 5px;
    display: inline-flex;
}

button.inline {
    height: auto !important;
    display: flex !important;
}

button .material-icons {
    line-height: unset !important;
}


/**
 * Plugin car infos related
 */

#pluginInfos {
    z-index: 2000;
    /* On the front */
    top: 1000%;
    left: 12.5%;
    width: 75%;
    position: fixed;
    background: white;
    opacity: 0;
}

#pluginInfos.shown {
    top: -34px;
    animation-name: pluginInfosCardShow;
    animation-duration: 1s;
    opacity: 1;
    /* max-height: 80%; */
}

#pluginInfosReadMe {
    max-height: calc(100% - 128px);
    overflow: scroll;
    border-top: solid 1px rgba(0, 0, 0, 0.33);
    border-bottom: solid 1px rgba(0, 0, 0, 0.33);
}

#pluginInfosReadMe article::-webkit-scrollbar {
    display: block;
}

#pluginInfosReadMe article::-webkit-scrollbar-thumb {
    display: block;
    background-color: white;
    border: solid 1px white;
    border-radius: 5px;
}

#pluginInfos.hidden {
    top: 1000%;
    animation-name: pluginInfosCardHide;
    animation-duration: 1s;
    opacity: 1;
}

@keyframes pluginInfosCardShow {
    from {
        top: 1000%;
        opacity: 0;
    }
    to {
        top: calc(76px + 5%);
        opacity: 1;
    }
}

@keyframes pluginInfosCardHide {
    from {
        top: calc(76px + 5%);
        opacity: 1;
    }
    to {
        top: 1000%;
        opacity: 0;
    }
}

.right {
    float: right;
    text-align: right;
    max-width: 50%;
}

.left {
    float: left;
    max-width: 50%;
}


/* Readme's*/

.anchor {
    display: none;
}

article {
    border-radius: 7.5px;
}


/* Search bar */

.search {
    padding: 24px;
    padding-top: 10px;
    padding-bottom: 1px;
    background-color: lightgray;
    border: solid 0px black;
    border-radius: 10px;
}

.search.big {
    padding-top: 24px;
    padding-bottom: 24px;
}

.search .material-icons {
    vertical-align: middle;
}


/**
 * Add plugin dialog related
 */

#pluginAddDialogBody1::-webkit-scrollbar {
    display: block;
    width: 15px;
}

#pluginAddDialogBody1::-webkit-scrollbar-thumb {
    display: block;
    background-color: black;
    border: solid 1px black;
    border-radius: 5px;
}